<template>
  <i-biz-caption-bar-control
    v-if="modelData.controlType === 'CAPTIONBAR'"
    v-bind="{ ...$props, ...$attrs }"
  />
  <i-biz-toolbar-control
    v-else-if="modelData.controlType === 'TOOLBAR'"
    v-bind="{ ...$props, ...$attrs }"
  />
  <i-biz-list-control
    v-else-if="modelData.controlType === 'LIST'"
    v-bind="{ ...$props, ...$attrs }"
  />
  <i-biz-md-ctrl-control
    v-else-if="modelData.controlType === 'MOBMDCTRL'"
    v-bind="{ ...$props, ...$attrs }"
  />
  <i-biz-search-bar-control
    v-else-if="modelData.controlType === 'SEARCHBAR'"
    v-bind="{ ...$props, ...$attrs }"
  />
  <i-biz-app-menu-control
    v-else-if="modelData.controlType === 'APPMENU'"
    v-bind="{ ...$props, ...$attrs }"
  />
  <i-biz-edit-form-control
    v-else-if="modelData.controlType === 'FORM'"
    v-bind="{ ...$props, ...$attrs }"
  />
  <i-biz-panel-control
    v-else-if="modelData.controlType === 'PANEL'"
    v-bind="{ ...$props, ...$attrs }"
  />
</template>
<script lang="ts">
export default {
  options: {
    addGlobalClass: true,
    virtualHost: true,
    styleIsolation: "shared"
  }
}
</script>
<script setup lang="ts">
import { IControl } from "@ibiz/model-core";
import { useNamespace } from "@/use";
import { PropType } from "vue";
const ns = useNamespace("control-shell");
const props = defineProps({
  modelData: {
    type: Object as PropType<IControl>,
    required: true,
  },
});
</script>
<style lang="scss">
//
</style>
